<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>小黑屋</title>
    <link rel="stylesheet" href="css/index.css">
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<header>头像</header>
<article>
    <div class="article-page" id="server-info">
        <div class="server-info-item">
            <div class="server-info-detail text-muted">
                <div class="server-info-left  ip"><span class="ip-value ">服务器地址：10.11.12.12</span></div>
                <div class="server-info-right  password"><span class="password-value ">服务器密码：123123</span></div>
            </div>
            <div class="server-rentInfo-detail text-info">
                <div class="server-info-left rent-userName"><span class="rent-userName-value">租借人：薛彬露</span></div>
                <div class="server-info-right rent-reason"><span class="rent-reason-value">借用原因：测试</span></div>
                <div class="server-info-left rent-startTime"><span class="rent-startTime-value">借出时间：2018-08-01</span> </div>
                <div class="server-info-right rent-endTime"><span class="rent-endTime-value">归还时间：2018-08-09</span></div>
                <div class="server-info-left rent-user-tel"><span class="rent-user-tel-value">手机：13116882565</span> </div>
                <div class="server-info-right rent-user-email"><span class="rent-user-email-value">邮箱：xuebinlu@163.com</span></div>
                <div class="rent-operation">
                    <button  class="rent-operation-bnt rent-operation-borrow btn btn-primary active">续用</button >
                    <button  class="rent-operation-bnt rent-operation-return btn btn-success active">归还</button >
                </div>
            </div>
        </div>
    </div>
</article>
<footer>当前页数</footer>
</body>
</html>